<template>
  <view class="elevator" :style="{ borderBottom: isLast ? '' : '2rpx solid #eee;' }" @click="toDetail(msg)">
    <view class="left">
      <view class="title">{{ msg.elevatorAddress }}</view>
      <view class="content" v-if="newCard && msg.label">
        <text class="deptName" :style="{ color: msg.label.includes('非年审') || msg.label.includes('明天即将违规') ? '#F79700' : '#E02020' }"
          v-for="(item, index) in msg.label" :key="index">
          {{ item }}
          <text class="line" v-if="index != msg.label.length - 1"></text>
        </text>
      </view>
      <view v-if="cardType == 1" class="content">
        <text class="deptName" :style="{ color: colorMap[msg.status] }">{{ msg.statusDesc }}
          <text class="line"></text>
        </text>
        <text class="deptName">{{ msg.deptName.length > 6 ? msg.deptName.substring(0, 6) + '...' : msg.deptName }}
          <text class="line" v-if="msg.status != 4"></text>
        </text>
        <text v-if="msg.status != 4">{{ msg.planDateStr }}</text>
      </view>
      <view v-if="cardType == 2" class="content">
        <text class="deptName">{{ msg.deptName }}
          <text class="line"></text>
        </text>

        <text>{{ "维修任务数:" + msg.planTotal }}</text>
      </view>
    </view>
    <view class="right">
      <uni-icons size="18" color="#999" type="arrowright"></uni-icons>
    </view>
  </view>
</template>

<script>
export default {
	props: {
		cardType: {
			type: [String, Number],
		},
		isLast: {
			type: Boolean,
			default: false,
		},
		msg: {
			type: Object,
		},
		newCard: {
			type: Boolean,
			default: false,
		},
		// 只限新卡片样式 用于电梯统计新的电梯详情页 中海  只有6的情况(暂停维保电梯总览) 表现为跳转到电梯详情时直接为保养计划tab
		type:{ 
			type: [String, Number],
		}
	},
	data() {
		return {
			colorMap: {
				2: '#E02020',
				3: '#F79700',
				4: '#666666',
			},
		};
	},
	methods: {
		toDetail(msg) {
			// return
			// 1是第一个图表的详情任务状态列表
			if (this.cardType == 1) {
				uni.navigateTo({
					url: '/subpages/repair/repariDetail?planId=' + msg.planId + '&elevatorId=' + msg.elevatorId
				});
			} else {
				uni.navigateTo({
					url: `/subpages/elevator/projectInfo/eleDetail?id=${msg.elevatorId}&type=${['4','6'].includes(this.type) ? 4 : 0}&toMain=${(['3','5'].includes(this.type)) ? 1 : 0}`
				});
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.elevator {
  padding: 32rpx 0;
  margin: 0 20rpx;

  display: flex;
  justify-content: space-between;

  .left {
    display: flex;
    flex: 1;
    flex-direction: column;

    .title {
      font-weight: 500;
    }
  }

  .right {
    display: flex;
    width: 60rpx;
    justify-content: flex-end;
    align-items: center;
  }

  .content {
    font-size: 26rpx;
    color: #666;
    padding: 4rpx 0;
    display: flex;
    flex-wrap: wrap;

    .deptName {
      position: relative;
      display: flex;
      padding-right: 20rpx;

      .line {
        position: absolute;
        right: 10rpx;
        top: 8rpx;
        width: 2rpx;
        height: 24rpx;
        background: #cccccc;
      }
    }
  }
}
</style>
